<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	xmlns:f="http://java.sun.com/jsf/core">

<h:body>
	<ui:composition template="/secured/workarea.xhtml">
		<ui:define name="espacio_trabajo">
			<h:form id="form">
				<table>
					<tr>
						<td align="left">
							<div class="breadcrumb flat" style="text-align: left">
								<h:commandLink action="#{menuBean.regresaInicio}" value="Inicio" />
								<h:outputLink value="#" styleClass="active">#{msg.catalogoCursos}</h:outputLink>
							</div>
						</td>
					</tr>
				</table>
				<p:growl id="growl" showDetail="true" />
				<p:panel>
					<h:outputText value="#{msg.frsCatalogoCursos}"
						style="text-align:left;" />
				</p:panel>
				<p:panel>
					<h:panelGrid columns="4" style="text-align:left;">
						<p:commandButton id="viewButton" value="#{msg.ver }"
							rendered="#{beanCurso.consulta}" icon="ui-icon-search"
							actionListener="#{beanCurso.initItemSelected}"
							oncomplete="verDialog.show()" update=":form:displayVer form:tabVerAl growl" />
						<p:commandButton id="viewDetaukButton" value="#{msg.verDetalle }"
							rendered="#{beanCurso.consulta}" icon="ui-icon-search"
							action="#{beanCurso.verDetalleItem}"
							update="growl" />
						<p:commandButton id="deleteButton" value="#{msg.eliminar }"
							rendered="#{beanCurso.borrar}" icon="ui-icon-trash"
							onclick="borrarDialog.show()" update="growl" />
					</h:panelGrid>
				</p:panel>
				<p:panel>
					<p:dataTable id="table" value="#{beanCurso.listItems}" var="item"
						rowKey="#{item.idCurso}" paginator="true"
						selection="#{beanCurso.itemSelected}"
						filteredValue="#{beanCurso.filteredList }"
						paginatorPosition="bottom" rows="#{beanTabla.noRegistros}">
						<p:column selectionMode="single" style="width:2%" />
						<p:column id="idref" headerText="#{msg.referencia}"
							filterBy="#{item.referencia }" sortBy="#{item.referencia}">
							<h:outputText value="#{item.referencia}" />
						</p:column>
						<p:column id="eqCve" headerText="#{msg.fechaInicio}"
							sortBy="#{item.fechaInicioString}"
							filterBy="#{item.fechaInicioString }">
							<h:outputText value="#{item.fechaInicioString}" />
						</p:column>
						<p:column id="estatusCol" headerText="#{msg.fechaFin}"
							filterBy="#{item.fechaFinString}" sortBy="#{item.fechaFinString}">
							<h:outputText value="#{item.fechaFinString}" />
						</p:column>
						<p:column id="instructor" headerText="#{msg.instructor}"
							filterBy="#{item.instructor}" sortBy="#{item.instructor}">
							<h:outputText value="#{item.instructor}" />
						</p:column>
					</p:dataTable>
					<h:panelGroup>
						<h:panelGrid columns="3" style="text-align:left;">
							<h:outputText value="#{msg.registrosPP}"
								style="font-size:x-small" />
							<h:panelGroup>
								<h:inputText size="3"
									style="font-size:x-small; height:15px; width:25px"
									value="#{beanTabla.registros}" id="noRegistrosPP" />
								<p:watermark value="#{beanTabla.noRegistros}"
									for="noRegistrosPP" />
							</h:panelGroup>
							<p:commandButton icon="ui-icon-arrowrefresh-1-w"
								style="font-size:x-small" update="table"
								actionListener="#{beanTabla.actualizaRegistros}" />
						</h:panelGrid>
					</h:panelGroup>
				</p:panel>
				<!-- Panel de Ver -->
				<p:dialog id="dialog" header="#{msg.ver}" widgetVar="verDialog"
					modal="true" position="top" draggable="false">
					<h:panelGrid id="displayVer" columns="2" cellpadding="4">
						<h:outputText value="#{msg.referencia}" />
						<p:inputText value="#{beanCurso.itemSelected.referencia}"
							style="font-weight:bold; width:150px" readonly="true" />
						<h:outputText value="#{msg.area}" />
						<p:inputText value="#{beanCurso.areaSelected}"
							style="font-weight:bold; width:150px" readonly="true" />
						<h:outputText value="#{msg.sede}" />
						<p:inputText value="#{beanCurso.sedeSelected}"
							style="font-weight:bold; width:150px" readonly="true" />
						<h:outputText value="#{msg.fechaInicio}" />
						<p:inputText value="#{beanCurso.itemSelected.fechaInicioString}"
							style="font-weight:bold; width:150px" readonly="true" />
						<h:outputText value="#{msg.fechaFin}" />
						<p:inputText value="#{beanCurso.itemSelected.fechaFinString}"
							style="font-weight:bold; width:150px" readonly="true" />
					</h:panelGrid>
					<p:tabView id="tabVerAl">
						<p:tab title="#{msg.alumnos}">
							<p:dataTable value="#{beanCurso.listAlumnosSelected}" emptyMessage="No se encontraron registros"
								rowKey="#{item.idAlumno }" var="item" paginator="true"
								paginatorPosition="bottom" rows="#{beanTabla.noRegistros}">
								<p:column headerText="#{msg.matricula}">
									<h:outputText value="#{item.matricula}" />
								</p:column>
								<p:column headerText="#{msg.nombre}">
									<h:outputText value="#{item.nombre}" />
								</p:column>
							</p:dataTable>
						</p:tab>
						<p:tab title="#{msg.materias}">
							<p:dataTable value="#{beanCurso.listMateriasSelected}" emptyMessage="No se encontraron registros"
								rowKey="#{item.idMateria }" var="item" paginator="true"
								paginatorPosition="bottom" rows="#{beanTabla.noRegistros}">
								<p:column headerText="#{msg.nombre}">
									<h:outputText value="#{item.nombre}" />
								</p:column>
							</p:dataTable>
						</p:tab>
					</p:tabView>
					<p:commandButton id="aceptarVerBtn" value="#{msg.aceptar }"
						icon="ui-icon-check" onclick="verDialog.hide()" />
				</p:dialog>
				<!-- Fin de panel de Ver -->

				
				<!-- Panel de borrado -->
				<div class="confirmDialog" style="color: black !important;">
					<p:confirmDialog showEffect="fade" widgetVar="borrarDialog"
						header="#{msg.confirmar }" message="#{msg.frsBorrarConfirmacion }"
						styleClass="confirmDialog">
						<p:commandButton value="#{msg.aceptar }"
							actionListener="#{beanCurso.delete}" update=":form:table, growl"
							styleClass="ui-confirmdialog-yes" icon="ui-icon-check"
							oncomplete="borrarDialog.hide()" />
						<p:commandButton value="#{msg.cancelar }" type="button"
							styleClass="ui-confirmdialog-no" icon="ui-icon-close"
							onclick="borrarDialog.hide()" />
					</p:confirmDialog>
				</div>
				<!-- Fin de panel de borrado -->
			</h:form>
		</ui:define>
	</ui:composition>
</h:body>
</html>